<template>
	<div class="diy_details_box diy_div_meeting_information">
		<!-- 现代化顶部横幅 -->
		<div class="modern_banner" :style="bannerStyle">
			<div class="banner_overlay"></div>
			<div class="banner_pattern"></div>
			<div class="banner_content_wrapper">
				<!-- 会议编号标签 -->
				<div class="conference_tag" v-if="obj.meeting_number">
					{{ obj.meeting_number }}
				</div>
				
				<!-- 大型序号 -->
				<div class="conference_edition">{{ getConferenceEdition() }}</div>
				
				<!-- 右侧内容 -->
				<div class="banner_right_content">
					<!-- IEEE Logo（如果有） -->
					<div class="ieee_logo" v-if="showIEEELogo">
						<div class="ieee_diamond"></div>
						<span class="ieee_text">IEEE</span>
					</div>
					
					<!-- 会议标题 -->
					<h1 class="conference_title_zh">{{ getConferenceName('zh') }}</h1>
					<h2 class="conference_title_en">{{ getConferenceName('en') }}</h2>
					
					<!-- 日期和地点 -->
					<div class="conference_meta">
						<span class="meta_date" v-if="formattedMeetingTime">{{ formattedMeetingTime }}</span>
						<span class="meta_location" v-if="formattedMeetingVenue">{{ formattedMeetingVenue }}</span>
					</div>
				</div>
			</div>
			
			<!-- 底部信息条带 -->
			<div class="banner_footer" v-if="indexingInfo">
				{{ indexingInfo }}
			</div>
		</div>

		<!-- 主要内容区域 -->
		<div class="warp">
			<div class="container detail_container">
				
				<!-- 倒计时和操作按钮 -->
				<div class="countdown_section">
					<div class="countdown_box">
						<span class="countdown_label">{{ t('countdownLabel') }}</span>
						<span class="countdown_time">{{ countdown }}</span>
					</div>
					<div class="action_buttons">
						<button class="btn btn_register" @click="goToRegister">
							{{ t('registerForMeeting') }}
						</button>
						<button class="btn btn_paper">{{ t('submitPaper') }}</button>
					</div>
				</div>

				<!-- 大会简介（合并会议简介和主办单位） -->
				<div class="conference_overview_section">
					<h2 class="section_title">
						<span class="title_icon">🏛️</span>
						{{ t('conferenceOverview') }}
					</h2>
					
					<!-- 会议简介文本 -->
					<div class="intro_content" v-if="obj.conference_introduction" v-html="$getBilingualText(obj.conference_introduction)"></div>
					
					<!-- 主办单位表格式布局 -->
					<div class="organizers_table" v-if="organizersList && organizersList.length > 0">
						
						<!-- 主办单位 -->
						<div class="organizer_row" v-if="organizersList.filter(o => o.type === 'host').length > 0">
							<div class="organizer_row_header">{{ t('organizerHost') }}</div>
							<div class="organizer_row_content">
								<div class="organizer_item_inline" v-for="(org, index) in organizersList.filter(o => o.type === 'host')" :key="'host-'+index">
									<div class="organizer_logo_inline">
										<img :src="getImageUrl(org.logo)" :alt="org.name" @error="handleImageError">
									</div>
									<div class="organizer_name_inline">{{ org.name }}</div>
								</div>
							</div>
						</div>
						
						<!-- 协办单位 -->
						<div class="organizer_row" v-if="organizersList.filter(o => o.type === 'co').length > 0">
							<div class="organizer_row_header">{{ t('organizerCo') }}</div>
							<div class="organizer_row_content">
								<div class="organizer_item_inline" v-for="(org, index) in organizersList.filter(o => o.type === 'co')" :key="'co-'+index">
									<div class="organizer_logo_inline">
										<img :src="getImageUrl(org.logo)" :alt="org.name" @error="handleImageError">
									</div>
									<div class="organizer_name_inline">{{ org.name }}</div>
								</div>
							</div>
						</div>
						
						<!-- 支持单位 -->
						<div class="organizer_row" v-if="organizersList.filter(o => o.type === 'support').length > 0">
							<div class="organizer_row_header">{{ t('organizerSupport') }}</div>
							<div class="organizer_row_content">
								<div class="organizer_item_inline" v-for="(org, index) in organizersList.filter(o => o.type === 'support')" :key="'support-'+index">
									<div class="organizer_logo_inline">
										<img :src="getImageUrl(org.logo)" :alt="org.name" @error="handleImageError">
									</div>
									<div class="organizer_name_inline">{{ org.name }}</div>
								</div>
							</div>
						</div>
						
					</div>
				</div>

			<!-- 场所设备 -->
			<div class="equipment_section" v-if="obj.site_equipment">
				<h2 class="section_title">
					<span class="title_icon">🏛️</span>
					{{ t('venueEquipment') }}
				</h2>
				<div class="equipment_content">
					{{ $getBilingualText(obj.site_equipment) }}
				</div>
			</div>

			<!-- 住宿推荐 -->
			<div class="accommodation_section" v-if="(obj.accommodation_description && obj.accommodation_description.trim() !== '') || (accommodationImages && accommodationImages.length > 0)">
				<h2 class="section_title">
					<span class="title_icon">🏨</span>
					{{ t('accommodationRecommendation') }}
				</h2>
				
				<!-- 住宿描述文字（单独显示，支持双语） -->
				<div class="accommodation_description" v-if="obj.accommodation_description && obj.accommodation_description.trim() !== ''">
					{{ $getBilingualText(obj.accommodation_description) }}
				</div>
				
				<!-- 住宿图片展示 -->
				<div class="accommodation_gallery" v-if="accommodationImages && accommodationImages.length > 0">
					<div class="gallery_item" v-for="(image, index) in accommodationImages" :key="'img-'+index">
						<img :src="getImageUrl(image.url)" :alt="image.caption || '住宿图片'" @error="handleImageError">
					</div>
				</div>
			</div>

				<!-- 大会组委 -->
				<div class="committee_section" v-if="committeeMembers.length">
					<h2 class="section_title">
						<span class="title_icon">👥</span>
						{{ t('committeeMembers') }}
					</h2>
					
					<!-- 动态组委会分组 -->
					<div class="committee_group" v-for="(group, type) in groupedCommittee" :key="type">
						<h3 class="committee_group_title">{{ $getBilingualText(type) }}</h3>
						<div class="committee_members">
							<div class="member_card" v-for="member in group" :key="member.committee_member_id">
								<div class="member_photo">
									<img :src="getImageUrl(member.member_photo)" :alt="member.member_name" @error="handleImageError">
								</div>
								<div class="member_info">
									<h4 class="member_name">{{ $getBilingualText(member.member_name) }}</h4>
									<p class="member_title" v-for="(title, idx) in parseTitle(member.member_title)" :key="'title-'+idx">{{ title }}</p>
									<p class="member_affiliation">{{ $getBilingualText(member.member_affiliation) }}</p>
								</div>
							</div>
						</div>
							</div>
					</div>

				<!-- 报告嘉宾 -->
				<div class="speakers_section" v-if="speakers.length">
					<h2 class="section_title">
						<span class="title_icon">🎤</span>
						{{ t('speakers') }}
					</h2>
					<div class="speakers_list">
						<div class="speaker_card" v-for="speaker in speakers" :key="speaker.speaker_id">
							<div class="speaker_photo">
								<img :src="getImageUrl(speaker.speaker_photo)" :alt="speaker.speaker_name" @error="handleImageError">
							</div>
							<div class="speaker_details">
								<h3 class="speaker_name">{{ $getBilingualText(speaker.speaker_name) }}</h3>
								<p class="speaker_position">{{ $getBilingualText(speaker.speaker_position) }}</p>
								<div class="speaker_bio" v-html="$getBilingualText(speaker.speaker_bio)"></div>
										</div>
						</div>
					</div>
				</div>

				<!-- 征稿主题 -->
				<div class="topics_section" v-if="callForPapers.length">
					<h2 class="section_title">
						<span class="title_icon">📢</span>
						{{ t('callForPapers') }}
					</h2>
					<p class="topics_notice">{{ t('callForPapersNotice') }}</p>
					<div class="topics_grid">
						<div class="topic_track" v-for="track in callForPapers" :key="track.call_for_papers_id">
							<h3 class="track_title">{{ $getBilingualText(track.track_name) }}</h3>
							<ul class="track_topics">
								<li v-for="(topic, index) in parseTopics(track.topics)" :key="'topic-'+index">{{ $getBilingualText(JSON.stringify(topic)) }}</li>
							</ul>
						</div>
						</div>
				</div>

				<!-- 重要信息提示 -->
				<div class="important_info">
					<h2 class="section_title">
						<span class="title_icon">⚠️</span>
						{{ t('importantInfo') }}
					</h2>
					<div class="important_content">
						<p><strong>{{ t('finalDeadline') }}</strong>{{ $formatDateTime(obj.meeting_time, 'datetime') }}</p>
						<p><strong>{{ t('acceptRejectNotice') }}</strong>{{ t('acceptRejectNoticeValue') }}</p>
						<p><strong>{{ t('indexing') }}</strong>{{ t('indexingValue') }}</p>
					</div>
				</div>

			</div>
		</div>
	</div>
</template>

<script>
	import mixin from "@/mixins/component.js";
	import mixinPage from "@/mixins/page.js";
	import mixinI18n from "@/mixins/i18n.js";

	export default {
		mixins: [mixin, mixinPage, mixinI18n],
		components: {

		},
		props: {
			obj: {
				type: Object,
				default: function() {
					return {};
				},
			}
		},
			data() {
			return {
				countdown: '',
				countdownTimer: null,
				committeeMembers: [],
				speakers: [],
				callForPapers: [],
				accommodationImages: [],
				imgListBase: [
						{
							titleKey: "meetingCover",
							name: "meeting_cover",
							type: "图片"
						},
				],
				itemListBase: [
						{
							titleKey: "conferenceName",
							name: "conference_name",
							type: "文本"
						},
						{
							titleKey: "meetingNumber",
							name: "meeting_number",
							type: "文本"
						},
						{
							titleKey: "meetingType",
							name: "meeting_type",
							type: "文本"
						},
						{
							titleKey: "meetingTime",
							name: "meeting_time",
							type: "文本"
						},
						{
							titleKey: "meetingVenue",
							name: "meeting_venue",
							type: "文本"
						},
						{
							titleKey: "participationFee",
							name: "amount_of_participation",
							type: "数字"
						},
				],
				richListBase: [
						{
							titleKey: "siteEquipment",
							name: "site_equipment",
							type: "多文本"
						},
						{
							titleKey: "conferenceIntroduction",
							name: "conference_introduction",
							type: "编辑"
						},
				],
												};
		},
		computed: {
			groupedCommittee() {
				const grouped = {};
				this.committeeMembers.forEach(member => {
					// 使用原始 committee_type 作为 key（用于分组）
					const typeKey = member.committee_type;
					if (!grouped[typeKey]) {
						grouped[typeKey] = [];
					}
					grouped[typeKey].push(member);
				});
				// 按display_order排序
				Object.keys(grouped).forEach(key => {
					grouped[key].sort((a, b) => a.display_order - b.display_order);
				});
				return grouped;
			},
			// 主办单位列表（带logo）- 改为 computed 属性，响应语言切换
			organizersList() {
				return this.parseOrganizersWithLogo(
					this.obj.organizer_host,
					this.obj.organizer_co,
					this.obj.organizer_support,
					this.obj.organizer_logos
				);
			},
			// 动态生成带翻译的列表
			imgList() {
				return this.imgListBase.map(item => ({
					...item,
					title: this.t(item.titleKey)
				}));
			},
			itemList() {
				return this.itemListBase.map(item => ({
					...item,
					title: this.t(item.titleKey)
				}));
			},
			richList() {
				return this.richListBase.map(item => ({
					...item,
					title: this.t(item.titleKey)
				}));
			},
			// 横幅样式（使用会议封面作为背景）
			bannerStyle() {
				const styles = {
					position: 'relative',
					width: '100%',
					minHeight: '400px',
					padding: '3rem 2rem',
					color: 'white',
					overflow: 'hidden'
				};
				
				// 如果有会议封面，使用封面作为背景
				if (this.obj.meeting_cover) {
					const coverUrl = this.$fullUrl(this.obj.meeting_cover);
					styles.backgroundImage = `url(${coverUrl})`;
					styles.backgroundSize = 'cover';
					styles.backgroundPosition = 'center';
					styles.backgroundRepeat = 'no-repeat';
				} else {
					// 如果没有封面，使用绿色渐变作为后备
					styles.background = 'linear-gradient(135deg, #4CAF50 0%, #45a049 50%, #388e3c 100%)';
				}
				
				return styles;
			},
			// 格式化会议时间（只显示日期）
			formattedMeetingTime() {
				if (!this.obj.meeting_time) return '';
				const date = this.$formatDateTime(this.obj.meeting_time, 'date');
				// 格式化为 YYYY.MM.DD
				return date.replace(/-/g, '.');
			},
			// 格式化会议地点
			formattedMeetingVenue() {
				if (!this.obj.meeting_venue) return '';
				const venue = this.$getBilingualText(this.obj.meeting_venue);
				// 如果包含"省"或"市"，提取省份和城市
				if (venue.includes('-')) {
					return venue;
				}
				return venue;
			},
			// 格式化截稿时间（从征稿主题中获取）
			formattedDeadline() {
				// 从callForPapers中获取最早的截稿时间
				if (this.callForPapers && this.callForPapers.length > 0) {
					// 假设callForPapers有deadline字段，如果没有则返回空
					const deadlines = this.callForPapers
						.map(cfp => cfp.deadline || cfp.submission_deadline)
						.filter(d => d)
						.sort();
					if (deadlines.length > 0) {
						const date = this.$formatDateTime(deadlines[0], 'date');
						// 格式化为 YYYY.MM.DD
						return date.replace(/-/g, '.');
					}
				}
				return '';
			},
			// 索引信息
			indexingInfo() {
				return this.t('indexingValue');
			},
			// 索引标签
			indexingTags() {
				const tags = this.t('indexingValue').split('、').map(s => s.trim()).filter(s => s);
				return tags.length > 0 ? tags : ['EI', 'Scopus'];
			},
			// 是否显示IEEE Logo
			showIEEELogo() {
				// 可以根据会议信息判断，暂时返回true
				return true;
			},
		},
		methods: {
			// 获取会议名称（指定语言）
			getConferenceName(lang) {
				if (!this.obj.conference_name) return '';
				try {
					const parsed = JSON.parse(this.obj.conference_name);
					if (parsed && typeof parsed === 'object') {
						return parsed[lang] || parsed.zh || parsed.en || '';
					}
				} catch (e) {
					// 不是JSON格式
				}
				return this.obj.conference_name;
			},
			// 获取会议届数（从会议名称中提取）
			getConferenceEdition() {
				const name = this.getConferenceName('zh');
				// 尝试提取数字，如"第五届" -> "5th"
				const match = name.match(/第([一二三四五六七八九十\d]+)届/);
				if (match) {
					const num = match[1];
					// 中文数字转英文
					const numMap = {
						'一': '1st', '二': '2nd', '三': '3rd', '四': '4th', '五': '5th',
						'六': '6th', '七': '7th', '八': '8th', '九': '9th', '十': '10th'
					};
					if (numMap[num]) {
						return numMap[num];
					}
					if (/^\d+$/.test(num)) {
						const n = parseInt(num);
						const suffix = n === 1 ? 'st' : n === 2 ? 'nd' : n === 3 ? 'rd' : 'th';
						return n + suffix;
					}
				}
				return '5th'; // 默认值
			},
			// 格式化字段值
			formatFieldValue(fieldName, value) {
				if (!value) return value;
				// 如果是会议时间字段，格式化日期
				if (fieldName === 'meeting_time') {
					return this.$formatDateTime(value, 'datetime');
				}
				// 如果是双语字段，解析 JSON
				const bilingualFields = ['conference_name', 'meeting_type', 'meeting_venue', 'site_equipment'];
				if (bilingualFields.includes(fieldName)) {
					return this.$getBilingualText(value);
				}
				return value;
			},
			// 格式化日期时间
			formatDateTime(value) {
				if (!value) return '';
				// 如果是时间戳（数字）
				if (typeof value === 'number') {
					const date = new Date(value);
					if (isNaN(date.getTime())) {
						return value;
					}
					return this.formatDate(date);
				}
				// 如果是字符串，尝试解析
				if (typeof value === 'string') {
					// 如果是时间戳字符串
					if (/^\d{10,13}$/.test(value)) {
						const timestamp = value.length === 10 ? parseInt(value) * 1000 : parseInt(value);
						const date = new Date(timestamp);
						if (!isNaN(date.getTime())) {
							return this.formatDate(date);
						}
					}
					// 尝试解析日期字符串
					const date = new Date(value);
					if (!isNaN(date.getTime())) {
						return this.formatDate(date);
					}
					return value;
				}
				// 如果是Date对象
				if (value instanceof Date) {
					return this.formatDate(value);
				}
				return String(value);
			},
			// 格式化日期为可读字符串
			formatDate(date) {
				if (!date || !(date instanceof Date) || isNaN(date.getTime())) {
					return '';
				}
				const year = date.getFullYear();
				const month = String(date.getMonth() + 1).padStart(2, '0');
				const day = String(date.getDate()).padStart(2, '0');
				const hours = String(date.getHours()).padStart(2, '0');
				const minutes = String(date.getMinutes()).padStart(2, '0');
				const seconds = String(date.getSeconds()).padStart(2, '0');
				return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			},
			get_user_info(name,id){
				var obj = null;
				var ret = "";
				if(obj){
					ret = obj.nickname+"-"+obj.username;
				}
				return ret;
			},
			// 跳转到参会报名页面
			goToRegister() {
				this.$router.push({
					path: '/user_participation/register',
					query: {
						meeting_information_id: this.obj.meeting_information_id
					}
				});
			},
			// 计算倒计时
			calculateCountdown() {
				if (!this.obj.meeting_time) {
					this.countdown = this.t('timeTBD');
					return;
				}
				
				const now = new Date().getTime();
				// 处理时间戳（数字）或日期字符串
				let meetingTime;
				if (typeof this.obj.meeting_time === 'number') {
					meetingTime = this.obj.meeting_time;
					// 如果是10位时间戳，转换为13位
					if (this.obj.meeting_time < 10000000000) {
						meetingTime = this.obj.meeting_time * 1000;
					}
				} else if (typeof this.obj.meeting_time === 'string') {
					// 如果是时间戳字符串
					if (/^\d{10,13}$/.test(this.obj.meeting_time)) {
						meetingTime = this.obj.meeting_time.length === 10 ? parseInt(this.obj.meeting_time) * 1000 : parseInt(this.obj.meeting_time);
					} else {
						meetingTime = new Date(this.obj.meeting_time).getTime();
					}
				} else {
					meetingTime = new Date(this.obj.meeting_time).getTime();
				}
				
				const distance = meetingTime - now;

				if (distance < 0) {
					this.countdown = this.t('meetingStarted');
					if (this.countdownTimer) {
						clearInterval(this.countdownTimer);
					}
					return;
				}

				const days = Math.floor(distance / (1000 * 60 * 60 * 24));
				const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
				const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
				const seconds = Math.floor((distance % (1000 * 60)) / 1000);

				this.countdown = `${days}${this.t('days')}${hours}${this.t('hours')}${minutes}${this.t('minutes')}${seconds}${this.t('seconds')}`;
			},
			// 启动倒计时
			startCountdown() {
				this.calculateCountdown();
				this.countdownTimer = setInterval(() => {
					this.calculateCountdown();
				}, 1000);
			},
			// 解析主办单位（支持双语 JSON 格式）
			parseOrganizers(str) {
				if (!str) return [];
				try {
					// 尝试解析为 JSON
					const json = JSON.parse(str);
					// 如果是双语格式，返回当前语言的值
					if (json && typeof json === 'object' && (json.zh || json.en)) {
						const lang = this.currentLanguage || 'zh';
						const orgText = json[lang] || json.zh || json.en || '';
						return orgText.split(',').map(s => s.trim()).filter(s => s);
					}
				} catch (e) {
					// 不是 JSON，按旧格式处理（逗号分隔的字符串）
				}
				return str.split(',').map(s => s.trim()).filter(s => s);
			},
			// 解析头衔（支持双语 JSON 格式）
			parseTitle(str) {
				if (!str) return [];
				try {
					// 尝试解析为 JSON
					const json = JSON.parse(str);
					// 如果是双语格式，返回当前语言的值
					if (json && typeof json === 'object' && (json.zh || json.en)) {
						const lang = this.currentLanguage || 'zh';
						const titleText = json[lang] || json.zh || json.en || '';
						return titleText.split(',').map(s => s.trim()).filter(s => s);
					}
				} catch (e) {
					// 不是 JSON，按旧格式处理（逗号分隔的字符串）
				}
				return str.split(',').map(s => s.trim()).filter(s => s);
			},
			// 解析主题（支持双语 JSON 数组格式）
			parseTopics(str) {
				if (!str) return [];
				try {
					const topics = JSON.parse(str);
					if (Array.isArray(topics)) {
						// 兼容旧格式（字符串数组）和新格式（双语对象数组）
						return topics.map(topic => {
							if (typeof topic === 'string') {
								// 旧格式：字符串，转换为双语格式
								return { zh: topic, en: '' };
							} else if (typeof topic === 'object' && topic !== null) {
								// 新格式：双语对象
								return topic;
							}
							return { zh: '', en: '' };
						});
					}
					return [];
				} catch (e) {
					return [];
				}
			},
			// 解析住宿图片（过滤掉无效的图片）
			parseAccommodationImages(str) {
				if (!str) return [];
				try {
					const images = JSON.parse(str);
					if (!Array.isArray(images)) return [];
					
					// 过滤掉无效的图片（没有url或url为空）
					return images.filter(image => {
						if (!image) return false;
						// 如果image是字符串，转换为对象
						if (typeof image === 'string') {
							return image.trim() !== '';
						}
						// 如果是对象，检查url字段
						return image.url && image.url.trim() !== '';
					}).map(image => {
						// 统一格式：如果是字符串，转换为对象
						if (typeof image === 'string') {
							return { url: image, caption: '' };
						}
						return {
							url: image.url || '',
							caption: image.caption || ''
						};
					});
				} catch (e) {
					console.error('解析住宿图片失败:', e);
					return [];
				}
			},
			// 解析主办单位JSON（新格式，包含logo，支持双语）
			parseOrganizersWithLogo(hostStr, coStr, supportStr, logosStr) {
				const result = [];
				const lang = this.currentLanguage || 'zh';
				
				// 解析logos JSON
				let logosObj = {};
				if (logosStr) {
					try {
						logosObj = JSON.parse(logosStr);
						console.log('=== 解析organizer_logos ===');
						console.log('原始字符串:', logosStr);
						console.log('解析后的对象:', logosObj);
					} catch (e) {
						console.error('解析organizer_logos失败:', e);
					}
				} else {
					console.warn('organizer_logos 字段为空');
				}
				
				// 解析双语文本的辅助函数
				const parseBilingualText = (str) => {
					if (!str) return '';
					try {
						const json = JSON.parse(str);
						if (json && typeof json === 'object' && (json.zh || json.en)) {
							return json[lang] || json.zh || json.en || '';
						}
					} catch (e) {
						// 不是 JSON，返回原值
					}
					return str;
				};
				
				// 解析单位名称字符串（支持逗号分隔和JSON格式）
				const parseOrganizerNames = (namesStr) => {
					if (!namesStr) return [];
					
					// 先尝试解析为双语JSON
					let parsedText = parseBilingualText(namesStr);
					
					// 如果解析后是字符串，按逗号分割
					if (typeof parsedText === 'string') {
						return parsedText.split(',').map(s => {
							let trimmed = s.trim();
							// 如果包含JSON片段，尝试提取中文
							if (trimmed.includes('"zh"') || trimmed.includes("'zh'")) {
								const zhMatch = trimmed.match(/["']?zh["']?\s*:\s*["']([^"']+)["']/);
								if (zhMatch && zhMatch[1]) {
									return zhMatch[1].trim();
								}
								// 清理JSON片段
								trimmed = trimmed.replace(/^\{?\s*["']?zh["']?\s*:\s*["']?/i, '')
									.replace(/["']?\s*\}?.*$/i, '')
									.replace(/["']+$/g, '');
							}
							return trimmed;
						}).filter(s => s && /[\u4e00-\u9fa5]/.test(s));
					}
					
					return [];
				};
				
				// 获取logo的辅助函数（支持新旧格式）
				const getLogo = (type, index, name) => {
					if (!logosObj[type]) {
						console.log(`logosObj.${type} 不存在`);
						return '/img/default.png';
					}
					
					console.log(`获取 ${type} 的logo, index=${index}, name=${name}`);
					console.log(`logosObj.${type}:`, logosObj[type]);
					
					// 新格式：{"host":{"zh":[{"name":"单位名","logo":"路径"}],"eh":[...]}, ...}
					if (logosObj[type].zh && Array.isArray(logosObj[type].zh)) {
						console.log(`使用新格式，zh数组长度: ${logosObj[type].zh.length}`);
						// 尝试通过名称匹配
						const logoItem = logosObj[type].zh.find(item => item && item.name === name);
						if (logoItem && logoItem.logo) {
							console.log(`通过名称匹配找到logo: ${logoItem.logo}`);
							return logoItem.logo;
						}
						// 如果名称匹配失败，使用索引
						if (logosObj[type].zh[index] && logosObj[type].zh[index].logo) {
							console.log(`通过索引找到logo: ${logosObj[type].zh[index].logo}`);
							return logosObj[type].zh[index].logo;
						}
						console.log(`新格式中未找到匹配的logo`);
					}
					
					// 旧格式兼容：{"host":["/img/logo1.png", ...], ...}
					if (Array.isArray(logosObj[type])) {
						console.log(`使用旧格式，数组长度: ${logosObj[type].length}`);
						const logo = logosObj[type][index] || '/img/default.png';
						console.log(`旧格式返回logo: ${logo}`);
						return logo;
					}
					
					console.log(`未找到匹配的格式，返回默认logo`);
					return '/img/default.png';
				};
				
				// 主办单位
				if (hostStr) {
					const hosts = parseOrganizerNames(hostStr);
					hosts.forEach((name, index) => {
						result.push({
							type: 'host',
							name: name,
							logo: getLogo('host', index, name)
						});
					});
				}
				
				// 协办单位
				if (coStr) {
					const cos = parseOrganizerNames(coStr);
					cos.forEach((name, index) => {
						result.push({
							type: 'co',
							name: name,
							logo: getLogo('co', index, name)
						});
					});
				}
				
				// 支持单位
				if (supportStr) {
					const supports = parseOrganizerNames(supportStr);
					supports.forEach((name, index) => {
						result.push({
							type: 'support',
							name: name,
							logo: getLogo('support', index, name)
						});
					});
				}
				
				return result;
			},
			// 获取大会组委
			async fetchCommitteeMembers() {
				if (!this.obj.meeting_information_id) return;
				const res = await this.$get('~/api/committee_member/get_list?', {
					meeting_id: this.obj.meeting_information_id,
					page: 1,
					size: 100
				});
				if (res.result && res.result.list) {
					this.committeeMembers = res.result.list;
				}
			},
			// 获取报告嘉宾
			async fetchSpeakers() {
				if (!this.obj.meeting_information_id) return;
				const res = await this.$get('~/api/speaker/get_list?', {
					meeting_id: this.obj.meeting_information_id,
					page: 1,
					size: 100
				});
				if (res.result && res.result.list) {
					this.speakers = res.result.list.sort((a, b) => a.display_order - b.display_order);
				}
			},
			// 获取征稿主题
			async fetchCallForPapers() {
				if (!this.obj.meeting_information_id) return;
				const res = await this.$get('~/api/call_for_papers/get_list?', {
					meeting_id: this.obj.meeting_information_id,
					page: 1,
					size: 100
				});
				if (res.result && res.result.list) {
					this.callForPapers = res.result.list.sort((a, b) => a.display_order - b.display_order);
				}
			},
		// 加载所有数据
		async loadAllData() {
			console.log('=== loadAllData 开始 ===');
			console.log('obj.accommodation_images:', this.obj.accommodation_images);
			
			if (this.obj.accommodation_images) {
				this.accommodationImages = this.parseAccommodationImages(this.obj.accommodation_images);
				console.log('解析后的 accommodationImages:', this.accommodationImages);
			} else {
				console.log('accommodation_images 字段为空或未定义');
			}
			
			// 注意：organizersList 现在是 computed 属性，会自动根据语言变化重新计算
			// 不需要在这里手动设置
			
			await Promise.all([
				this.fetchCommitteeMembers(),
				this.fetchSpeakers(),
				this.fetchCallForPapers()
			]);
		},
			// 处理图片URL
			getImageUrl(path) {
				if (!path || path.trim() === '') {
					return this.getPlaceholderImage();
				}
				
				const trimmedPath = path.trim();
				
				// 如果路径以 /api/upload 开头，说明是后端上传的图片，使用 $fullUrl
				if (trimmedPath.startsWith('/api/upload')) {
					return this.$fullUrl(trimmedPath);
				}
				// 如果路径以 http:// 或 https:// 开头，直接返回
				if (trimmedPath.startsWith('http://') || trimmedPath.startsWith('https://')) {
					return trimmedPath;
				}
				// 如果路径以 / 开头，可能是静态资源
				if (trimmedPath.startsWith('/')) {
					return trimmedPath;
				}
				// 否则返回占位图
				return this.getPlaceholderImage();
			},
			// 图片加载失败处理
			handleImageError(event) {
				// 如果图片加载失败，隐藏该图片元素
				const imgElement = event.target;
				const galleryItem = imgElement.closest('.gallery_item');
				if (galleryItem) {
					galleryItem.style.display = 'none';
				} else {
					// 如果不是在gallery中，使用占位图
					imgElement.src = this.getPlaceholderImage();
				}
			},
			// 获取占位图片（使用base64编码的灰色头像）
			getPlaceholderImage() {
				// 返回一个简单的SVG占位图
				return '';
			},
			// 添加点击记录
			addHits() {
				if (!this.obj || !this.obj.meeting_information_id) return;
				
				const user_id = this.$store.state.user && this.$store.state.user.user_id ? this.$store.state.user.user_id : 0;
				this.$post('~/api/hits/add?', {
					user_id: user_id,
					source_table: 'meeting_information',
					source_field: 'meeting_information_id',
					source_id: this.obj.meeting_information_id
				}, res => {
					console.log('点击记录已添加:', res);
				}, err => {
					console.error('添加点击记录失败:', err);
				})
			}
		},
		created() {
		},
		mounted() {
			this.startCountdown();
			this.loadAllData();
			// 添加点击记录
			if (this.obj && this.obj.meeting_information_id) {
				this.addHits();
			}
		},
		beforeDestroy() {
			if (this.countdownTimer) {
				clearInterval(this.countdownTimer);
			}
		},
		watch:{
			obj:{
				deep: true,
				handler(newVal){
					this.startCountdown();
					if (newVal && newVal.meeting_information_id) {
						this.loadAllData();
					}
				}
			}
		},
	};
</script>

<style scoped>
/* 详情页整体布局 */
.diy_details_box {
	background: #f5f7fa;
	min-height: 100vh;
}

/* 现代化横幅样式 */
.modern_banner {
	position: relative;
	width: 100%;
	min-height: 400px;
	padding: 3rem 2rem;
	color: white;
	overflow: hidden;
}

/* 背景遮罩层（确保文字清晰可读） */
.banner_overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.6));
	z-index: 1;
}

.banner_pattern {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 60px;
	background: repeating-linear-gradient(
		45deg,
		rgba(255, 255, 255, 0.1) 0px,
		rgba(255, 255, 255, 0.1) 10px,
		transparent 10px,
		transparent 20px
	);
	z-index: 2;
}

.banner_content_wrapper {
	position: relative;
	z-index: 3;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: flex-start;
	gap: 2rem;
}

.conference_tag {
	position: absolute;
	top: 1rem;
	left: 2rem;
	background: rgba(255, 255, 255, 0.25);
	padding: 0.5rem 1rem;
	border-radius: 0.5rem;
	font-size: 0.9rem;
	font-weight: 600;
	backdrop-filter: blur(10px);
}

.conference_edition {
	font-size: 8rem;
	font-weight: 900;
	opacity: 0.2;
	line-height: 1;
	color: white;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
	flex-shrink: 0;
}

.banner_right_content {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.ieee_logo {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	align-self: flex-end;
	margin-bottom: 1rem;
}

.ieee_diamond {
	width: 24px;
	height: 24px;
	background: #00629B;
	transform: rotate(45deg);
	position: relative;
}

.ieee_diamond::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
	width: 12px;
	height: 12px;
	background: white;
	border-radius: 2px;
}

.ieee_text {
	color: #00629B;
	font-weight: 700;
	font-size: 1.2rem;
	background: white;
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
}

.conference_title_zh {
	font-size: 2.5rem;
	font-weight: 700;
	margin: 0;
	line-height: 1.2;
	color: white;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
}

.conference_title_en {
	font-size: 1.2rem;
	font-weight: 400;
	margin: 0;
	opacity: 0.95;
	color: white;
}

.conference_meta {
	display: flex;
	gap: 1.5rem;
	flex-wrap: wrap;
	margin-top: 1rem;
}

.meta_date,
.meta_location {
	font-size: 1rem;
	opacity: 0.9;
}

.banner_footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, 0.2);
	padding: 1rem 2rem;
	text-align: center;
	font-size: 0.9rem;
	backdrop-filter: blur(10px);
	z-index: 3;
}


/* 主要内容容器 */
.detail_container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2rem 1rem;
}

/* 倒计时区域 */
.countdown_section {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}

.countdown_box {
	color: white;
}

.countdown_label {
	font-size: 1.2rem;
	margin-right: 1rem;
}

.countdown_time {
	font-size: 2rem;
	font-weight: bold;
	background: rgba(255, 255, 255, 0.2);
	padding: 0.5rem 1.5rem;
	border-radius: 0.5rem;
	display: inline-block;
}

.action_buttons {
	display: flex;
	gap: 1rem;
}

.btn_register {
	background: #ff6b6b;
	border: none;
	color: white;
	padding: 0.75rem 2rem;
	font-size: 1.1rem;
	border-radius: 0.5rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

.btn_register:hover {
	background: #ff5252;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(255, 107, 107, 0.4);
}

.btn_paper {
	background: #4ecdc4;
	border: none;
	color: white;
	padding: 0.75rem 2rem;
	font-size: 1.1rem;
	border-radius: 0.5rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

.btn_paper:hover {
	background: #45b7aa;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(78, 205, 196, 0.4);
}

/* 统一的卡片样式 */
.info_card,
.intro_section,
.equipment_section,
.important_info {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
}

.info_card:hover,
.intro_section:hover,
.equipment_section:hover,
.important_info:hover {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
	transform: translateY(-2px);
}

/* 标题样式 */
.section_title {
	font-size: 1.8rem;
	font-weight: bold;
	color: #2c3e50;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 3px solid #667eea;
	display: flex;
	align-items: center;
}

.title_icon {
	font-size: 2rem;
	margin-right: 0.75rem;
}

/* 信息网格布局 */
.info_grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.info_item {
		display: flex;
	padding: 1rem;
	background: #f8f9fa;
	border-radius: 0.5rem;
	transition: all 0.3s ease;
}

.info_item:hover {
	background: #e9ecef;
	transform: translateX(5px);
}

.info_label {
	font-weight: 600;
	color: #495057;
	min-width: 100px;
	margin-right: 1rem;
}

.info_value {
	color: #212529;
	flex: 1;
}

/* 简介内容 */
.intro_content {
	color: #495057;
	line-height: 1.8;
	font-size: 1rem;
}

.intro_content >>> h1,
.intro_content >>> h2,
.intro_content >>> h3 {
	color: #2c3e50;
	margin-top: 1.5rem;
	margin-bottom: 1rem;
}

.intro_content >>> p {
	margin-bottom: 1rem;
}

.intro_content >>> img {
	max-width: 100%;
	height: auto;
	border-radius: 0.5rem;
	margin: 1rem 0;
}

/* 设备内容 */
.equipment_content {
	color: #495057;
	line-height: 1.8;
	font-size: 1rem;
	white-space: pre-wrap;
}

/* 重要信息 */
.important_info {
	background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
	border-left: 5px solid #fdcb6e;
}

.important_info .section_title {
	border-bottom-color: #e17055;
}

.important_content {
	color: #2d3436;
	line-height: 2;
}

.important_content p {
	margin-bottom: 0.75rem;
	font-size: 1.05rem;
}

.important_content strong {
	color: #d63031;
	font-weight: 600;
}

/* 主办单位样式 */
.organizers_section {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.organizers_content {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.organizer_category {
	padding: 1.5rem;
	background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
	border-radius: 0.75rem;
	border-left: 4px solid #667eea;
}

.category_title {
	font-size: 1.3rem;
	font-weight: bold;
	color: #495057;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid #dee2e6;
}

.organizer_list {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.organizer_item {
	background: white;
	padding: 0.75rem 1.5rem;
	border-radius: 0.5rem;
	font-size: 1rem;
	color: #495057;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
	transition: all 0.3s ease;
}

.organizer_item:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
	color: #667eea;
}

/* 场所设备样式 */
.equipment_section {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.equipment_content {
	font-size: 1rem;
	line-height: 1.8;
	color: #495057;
	margin-top: 1rem;
	white-space: pre-wrap;
	word-wrap: break-word;
}

/* 住宿推荐样式 */
.accommodation_section {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* 住宿描述文字样式 */
.accommodation_description {
	font-size: 1rem;
	line-height: 1.8;
	color: #495057;
	margin: 1rem 0 1.5rem 0;
	padding: 1rem;
	background: #f8f9fa;
	border-radius: 0.5rem;
	border-left: 4px solid #667eea;
	white-space: pre-wrap;
	word-wrap: break-word;
}

/* 住宿图片展示样式 */
.accommodation_gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 1.5rem;
	margin-top: 1.5rem;
}

.gallery_item {
	border-radius: 0.5rem;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
}

.gallery_item:hover {
	transform: translateY(-4px);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

.gallery_item img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
}


/* 大会组委样式 */
.committee_section {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.committee_group {
	margin-bottom: 2.5rem;
}

.committee_group:last-child {
	margin-bottom: 0;
}

.committee_group_title {
	font-size: 1.4rem;
	font-weight: bold;
	color: #2c3e50;
	margin-bottom: 1.5rem;
	padding: 0.75rem 1rem;
	background: linear-gradient(135deg, #e8eaf6 0%, #c5cae9 100%);
	border-radius: 0.5rem;
	border-left: 4px solid #667eea;
}

.committee_members {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1.5rem;
}

.member_card {
	display: flex;
	gap: 1rem;
	padding: 1.5rem;
	background: #f8f9fa;
	border-radius: 0.75rem;
	transition: all 0.3s ease;
	border: 2px solid transparent;
}

.member_card:hover {
	background: white;
	border-color: #667eea;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.2);
	transform: translateY(-2px);
}

.member_photo {
	flex-shrink: 0;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	overflow: hidden;
	border: 3px solid #667eea;
}

.member_photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.member_info {
	flex: 1;
}

.member_name {
	font-size: 1.1rem;
	font-weight: bold;
	color: #2c3e50;
	margin-bottom: 0.5rem;
}

.member_title {
	font-size: 0.9rem;
	color: #7f8c8d;
	margin: 0.25rem 0;
}

.member_affiliation {
	font-size: 0.95rem;
	color: #495057;
	margin-top: 0.5rem;
	font-weight: 500;
}

/* 报告嘉宾样式 */
.speakers_section {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.speakers_list {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.speaker_card {
	display: flex;
	gap: 2rem;
	padding: 2rem;
	background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
	border-radius: 1rem;
	border: 2px solid #dee2e6;
	transition: all 0.3s ease;
}

.speaker_card:hover {
	border-color: #667eea;
	box-shadow: 0 6px 20px rgba(102, 126, 234, 0.15);
	transform: translateX(5px);
}

.speaker_photo {
	flex-shrink: 0;
	width: 150px;
	height: 150px;
	border-radius: 0.75rem;
	overflow: hidden;
	border: 3px solid #667eea;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.speaker_photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.speaker_details {
	flex: 1;
}

.speaker_name {
	font-size: 1.5rem;
	font-weight: bold;
	color: #2c3e50;
	margin-bottom: 0.5rem;
}

.speaker_position {
	font-size: 1.1rem;
	color: #667eea;
	font-weight: 600;
	margin-bottom: 1rem;
}

.speaker_bio {
	color: #495057;
	line-height: 1.8;
}

.speaker_bio p {
	margin-bottom: 0.75rem;
	text-align: justify;
}

/* 征稿主题样式 */
.topics_section {
	background: white;
	border-radius: 1rem;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.topics_notice {
	color: #e74c3c;
	font-size: 0.95rem;
	margin-bottom: 1.5rem;
	padding: 1rem;
	background: #fff5f5;
	border-left: 4px solid #e74c3c;
	border-radius: 0.5rem;
}

/* 大会简介（合并会议简介和主办单位） */
.conference_overview_section {
	margin: 2rem 0;
	padding: 2rem;
	background: white;
	border-radius: 0.75rem;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.conference_overview_section .intro_content {
	margin-bottom: 2rem;
	line-height: 1.8;
	color: #555;
	font-size: 1rem;
}

/* 主办单位表格式布局 */
.organizers_table {
	border: 2px solid #333;
	border-radius: 0.5rem;
	overflow: hidden;
	margin-top: 2rem;
}

.organizer_row {
	display: flex;
	border-bottom: 2px solid #333;
	min-height: 120px;
}

.organizer_row:last-child {
	border-bottom: none;
}

.organizer_row_header {
	width: 150px;
	flex-shrink: 0;
	background: white;
	border-right: 2px solid #333;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	font-weight: 700;
	color: #000;
	padding: 1rem;
	text-align: center;
}

.organizer_row_content {
	flex: 1;
	background: white;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2rem;
	padding: 1.5rem 2rem;
}

.organizer_item_inline {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 180px;
}

.organizer_logo_inline {
	width: 120px;
	height: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 0.75rem;
	padding: 0.5rem;
}

.organizer_logo_inline img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.organizer_name_inline {
	font-size: 0.95rem;
	font-weight: 500;
	color: #333;
	text-align: center;
	line-height: 1.4;
}

/* 响应式设计 */
@media (max-width: 768px) {
	.organizer_row {
		flex-direction: column;
		min-height: auto;
	}
	
	.organizer_row_header {
		width: 100%;
		border-right: none;
		border-bottom: 2px solid #333;
		padding: 0.75rem;
		font-size: 1rem;
	}
	
	.organizer_row_content {
		flex-direction: column;
		gap: 1.5rem;
		padding: 1.5rem;
	}
	
	.organizer_item_inline {
		min-width: 150px;
	}
	
	.organizer_logo_inline {
		width: 100px;
		height: 100px;
	}
}

.topics_grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.topic_track {
	padding: 1.5rem;
	background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
	border-radius: 0.75rem;
	border: 2px solid #dee2e6;
	transition: all 0.3s ease;
}

.topic_track:hover {
	border-color: #667eea;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

.track_title {
	font-size: 1.2rem;
	font-weight: bold;
	color: #2c3e50;
	margin-bottom: 1rem;
	padding-bottom: 0.75rem;
	border-bottom: 2px solid #667eea;
}

.track_topics {
	list-style: none;
	padding: 0;
	margin: 0;
}

.track_topics li {
	padding: 0.5rem 0 0.5rem 1.5rem;
	color: #495057;
	position: relative;
	line-height: 1.6;
	transition: all 0.2s ease;
}

.track_topics li:before {
	content: "▸";
	position: absolute;
	left: 0;
	color: #667eea;
	font-weight: bold;
}

.track_topics li:hover {
	color: #667eea;
	padding-left: 2rem;
}

/* 响应式设计 */
@media (max-width: 768px) {
	.banner_title {
		font-size: 2rem;
	}
	
	.banner_subtitle {
		font-size: 1.2rem;
	}
	
	.countdown_section {
		flex-direction: column;
		gap: 1rem;
	}
	
	.action_buttons {
		flex-direction: column;
		width: 100%;
	}
	
	.btn_register,
	.btn_paper {
		width: 100%;
	}
	
	.info_grid {
		grid-template-columns: 1fr;
	}
	
	.countdown_time {
		font-size: 1.5rem;
	}
	
	.accommodation_gallery {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.modern_banner {
		padding: 2rem 1rem;
		min-height: 350px;
	}
	
	.conference_edition {
		font-size: 5rem;
	}
	
	.conference_title_zh {
		font-size: 1.8rem;
	}
	
	.conference_title_en {
		font-size: 1rem;
	}
	
	.banner_content_wrapper {
		flex-direction: column;
		gap: 1rem;
	}
	
	.banner_right_content {
		width: 100%;
	}
	
	.ieee_logo {
		align-self: flex-start;
	}
	
	.conference_tag {
		position: relative;
		top: auto;
		left: auto;
		margin-bottom: 1rem;
	}
	
	.committee_members {
		grid-template-columns: 1fr;
	}
	
	.speaker_card {
		flex-direction: column;
		align-items: center;
	}
	
	.speaker_photo {
		width: 120px;
		height: 120px;
	}
	
	.topics_grid {
		grid-template-columns: 1fr;
	}
}
</style>
